<template>
    <div>
        <h3>发表评论</h3>
        <hr>
        <textarea placeholder="请输入要BB的内容（最多BB120个字）" maxlength="
        120" v-model="msg"></textarea>
        <mt-button type="primary" size="large" @click='getCommentt'>发表评论</mt-button>
        <div class="pl_item">
          <div class="pl_index" v-for="(item,index) in comment" :key="item.index">
            <div class="pl_time">第{{ index+1 }}楼用户:匿名用户  发表时间:2020.04.01</div>
            <div class="pl_wen">{{ item }}</div>
          </div>
        
        </div>
         <mt-button type="danger" size="large" plain @click="getComment">加载更多</mt-button>
    </div>
</template>

<script>

import { Toast } from 'mint-ui';

 export default {
    data() {
        return {
            msg:"",
            comment:[
                "这个新闻是什么辣鸡",
                "全都是标题党",
                "今天有太阳，差评",
                "四点了，差评",
                "网速太快差评",
                "武汉加油"
            ],
            commentt:[
                "这是啥呀",
                "这啥已不是",
                "评论给返现吗",
                "一个评论无路爱钱",
                "加啊鸡腿",
                "疫情早点就输",
                "加油好年",
                "哈哈哈"
            ]
        }
    },
    methods:{
        getComment(){
            this.comment=this.comment.concat(this.commentt)
        },
        getCommentt(){
            if(this.msg===""){
                Toast('评论内容不能为空')
                return false
            }
            this.comment.unshift(this.msg)
            //  this.getComment()
             this.msg=""
        }
    }
}
</script>

<style scoped>
.pl_item{
    padding:2px 4px;
    font-size:13px;
}
.pl_time{
    padding:8px 4px;
    background-color:#929292;
}
.pl_wen{
    padding:5px 10px;
}
</style>

